<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>网址大全</title>
	<style>
		*{
			margin: 0;
			padding: 0;
		}
		#dv a{
			display: inline-block;
			width: 11%;
			text-decoration: none;
			color:#000;
			margin: 10px 0;
		}
		#dv #active{
			color:orangered;
		}
	</style>
</head>
<body>
	<div id="dv">
		<a v-for="employee in message" :href="employee.link" :id="employee.active">
			<img :src="employee.src" alt="">
			{{employee.title}}
		</a>
	</div>


	<script src='js/vue.js'></script>
	<script src='js/axios.min.js'></script>
	<script>
	var vm = new Vue({
		el:'#dv',
		data:{
			message: '数据加载中.....'
		},
		mounted(){
			axios
				.get('json/cc.json')
				.then(response => (this.message = response.data.employees))
				.catch(function (error){
					console.log(error);
				});
		}
	}) 
	</script>
</body>
</html>